<!--
 * @Author: Aileen的代码仓库 aileen20030308@qq.com
 * @Date: 2025-05-13 22:01:38
 * @LastEditors: Aileen的代码仓库 aileen20030308@qq.com
 * @LastEditTime: 2025-05-14 17:51:53
 * @FilePath: \src\main\resources\static\index.html
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">

  <title>验证码</title>
  <style>
    #inputCaptcha {
      height: 30px;
      vertical-align: middle;
    }

    #verificationCodeImg {
      vertical-align: middle;
    }

    #checkCaptcha {
      height: 40px;
      width: 100px;
    }
  </style>
</head>

<body>
  <h1>输入验证码</h1>
  <div id="confirm">
    <input type="text" name="inputCaptcha" id="inputCaptcha">
    <!--    将src的路径改成本地路径-->
    <img id="verificationCodeImg" src="captcha/get" style="cursor: pointer;" title="看不清？换一张" />
    <input type="button" value="提交" id="checkCaptcha">
  </div>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
  <script>
    //点击图片,重新加载
    $("#verificationCodeImg").click(function () {//获取后端图片将请求返回回来,dt用于防止缓存
      $(this).hide().attr('src', 'captcha/get?dt=' + new Date().getTime()).fadeIn();
    });

    $("#checkCaptcha").click(function () {

      alert("验证码校验");
    });

  </script>
</body>

</html>